<template>
  <div class="minus">
    <button @click="minus">点击-1</button> 
    <button @click="minusAsync">点击延迟-1</button> 
    <p class="text">{{count}}</p>
  </div>
</template>
<script>
import {mapState,mapMutations,mapActions} from "vuex"
export default {
  data(){
    return{

    }
  },
  computed:{
   ...mapState(["count"])
  },
  methods:{
    ...mapMutations(['xminus']),
    ...mapActions(['addAsync']),
   minus(){
     this.xminus(10)
   },
    minusAsync(){
    this.addAsync(6)
  }
  },
 
 
}
</script>
<style scoped>
.minus>.text{
 background-color: red;
 color: black;
 width: 50px;
 height: 50px;
 text-align: center;
 line-height: 50px;
}
</style>